@page("Add New Course"){
	@loginheader("Add New Course")

	<div class="page-focus">
	<h3>Add New Course</h3>
	<p>
		<form class="form-horizontal" action="@routes.Course.addCourseToEdunera()" method="post">
		  <div class="control-group">
		    <label class="control-label" for="inputName">Name</label>
		    <div class="controls">
		      <input type="text" id="inputName" name="name" placeholder="Name">
		    </div>
		  </div>
		  <div class="control-group">
		    <label class="control-label" for="inputCode">Code</label>
		    <div class="controls">
		      <input type="text" id="inputCode" name="code" placeholder="Code">
		    </div>
		  </div>		  
		  <div class="control-group">
		    <label class="control-label" for="inputpic">Picture</label>
		    <div class="controls">
		      <input type="file" id="inputpic" name="picture" placeholder="Picture">
		    </div>
		  </div>
		  <div class="control-group">
		    <label class="control-label" for="instructor">Instructor Name</label>
		    <div class="controls">
		    <!--instructor browser -->
		      <input list="browsers" id="instructor">
                  <datalist id="browsers">
				  <option value="Adam, Smith (Berkeley)">
				  <option value="Ariely, Dan (Duke)">
				</datalist>
				<a href="@{routes.Course.newInstructor()}" class="btn">New Instructor Add</a>
		    </div>
		  </div>
		  <div class="control-group">
		    <label class="control-label" for="institution">Institution Name</label>
		    <div class="controls">
		    <!--instructor browser -->
		      <input list="instbrowsers" id="institution">
                  <datalist id="instbrowsers">
				  <option value="Berkeley University">
				  <option value="Duke University">
				</datalist>
				</t><a href="@{routes.Course.newInstitution()}" class="btn">New Institution Add</a>
		    </div>
		  </div>
		  <div class="control-group">
		    <label class="control-label" for="startDate">Start Date</label>
		    <div class="controls">
		      <input type="text" id="startDate" />
              </div>
              </div>
		   <div class="control-group">
		    <label class="control-label" for="endDate">End Date</label>
		    <div class="controls">
		      <input type="text" id="endDate" />	    
             </div>
		  </div>
		  <div class="control-group">
		    <label class="control-label" for="description">Description</label>
		    <div class="controls">
		      <textarea class="span6" rows="20" id="description" name="description"></textarea>
		    </div>
		  </div>
		  <div class="control-group">
		    <label class="control-label" for="shortdescription">Short Description</label>
		    <div class="controls">
		      <textarea class="span6" rows="4" id="shortDescription" name="shortDescription"></textarea>
		    </div>
		  </div>
		  <!--Add New Tag-->
		 <div class="control-group">
			<label class="control-label" for="newtag">New Tag</label>
			<div class="controls">
				 <!--tag browser -->
				 <input list="tagbrowsers" id="tags" name="tags">
				 <datalist id="tagbrowsers">
				 <option value="Art">
				 <option value="Architecture">
				 <option value="Biology">
				 <option value="Computer Science">
				 </datalist>
				 <button type="button" class="btn">Add New</button>
			</div>
		</div>
		<div class="control-group">
		 <div class="controls">
		<label class="control-label" id="tags">tag1, tag2, tag3</label>
		</div></div>
		<!-- End of Add new Tag-->
		  <div class="control-group">
		    <div class="controls">
		      <button type="submit" class="btn">Add New Course to</button>
		      @eduneralogo(1)
		    </div>
		  </div>
		</form>
	</p>
	</div>
}